<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <link rel="stylesheet" type="text/css" href="/public/static/wx/css/base.css" />
    <link rel="stylesheet" type="text/css" href="/public/static/wx/plug-in/layui/css/layui.css" />
    <link rel="stylesheet" type="text/css" href="/public/static/wx/css/creat-order.css" />
    <script src="/public/static/wx/js/flex.js" type="text/javascript" charset="utf-8"></script>
    <title>添加账户</title>

    <style>
        .t{
            text-align: justify;
        }
        .layui-form-radio{
            line-height: 1.5rem;
        }
    </style>
</head>

<body>

<div class="index">
    <div class="mask">
        <ul>
        </ul>
    </div>

    <form class="layui-form">
        <ul class="list">
            <li class="clearfix">
                <p class="t">名称</p>
                <input type="text" name="name" placeholder="请输入名称" lay-verify="required"  />
            </li>
            <li class="clearfix">
                <p class="t">手机号码</p>
                <input type="text" name="tel" placeholder="请输入手机号码" lay-verify="required"  />
            </li>
            <li class="clearfix">

                <p class="t">密码</p>
                <input type="password" name="pwd" placeholder="请输入密码" lay-verify="required" />
            </li>
            <li class="clearfix">

                <p class="t">确认密码</p>
                <input type="password" name="qpwd" placeholder="请输入确认密码" lay-verify="required" />
            </li>
            <li class="clearfix">
                <p class="t">是否启用</p>
                <div class="layui-input-block">
                    <input type="radio" name="is_open"  value="1" title="是" style="display: none;" checked>
                    <input type="radio" name="is_open"  value="0" title="否" style="display: none;" >
                </div>
            </li>

        </ul>

        <div class="btn" id="btn" >
            提交
        </div>
    </form>
</div>
<script src="/public/static/wx/js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="/public/static/wx/plug-in/layui/layui.all.js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript">

    layui.use(['form'], function() {
        var subs = {};
        var form = layui.form;
        //提交数据
        $('#btn').click(function () {

            subs.name = $.trim($('input[name=name]').val());
            subs.tel = $.trim($('input[name=tel]').val());
            subs.pwd = $.trim($('input[name=pwd]').val());
            subs.qpwd = $.trim($('input[name=qpwd]').val());
            subs.is_open = $.trim($('input[name=is_open]:checked').val());

            if(subs.name.length<1){
                $('[d-k=title]').focus();
                layer.msg("请输入名称",{icon:5});
                return;
            }
            if(!(/^1[3|4|5|8][0-9]\d{4,8}$/.test(subs.tel))){
                $('[d-k=tel]').focus();
                layer.msg("请输入合法联系方式",{icon:5});
                return;
            }

            if(subs.pwd.length<1){
                $('[d-k=title]').focus();
                layer.msg("请输入密码",{icon:5});
                return;
            }

            if(subs.qpwd.length<1){
                $('[d-k=title]').focus();
                layer.msg("请输入确认密码",{icon:5});
                return;
            }
            if(subs.qpwd != subs.pwd){
                $('[d-k=title]').focus();
                layer.msg("密码不一致",{icon:5});
                return;
            }

            $.post('{:url("addPower")}',subs,function(res){
                if(res.code == 1){
                    layer.msg("数据提交成功！",{icon:6,shade:0.1},function () {
                        location.href = '{:url("elecUI")}';
                    });
                }else{
                    layer.msg(res.msg,{offset:['45%','45%'],icon:5});
                }
            });

        });
    });

    //阻止手机软键盘弹出
    $(".list li a input").focus(function() {
        document.activeElement.blur();
    });




</script>
</body>

</html>